<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
		<meta name="format-detection" content="telephone=no" />
		<title>速翔网络</title>
		<link rel="stylesheet" type="text/css" href="../c/aui.css" />
		<style>
			body {
			background: #fff;
			color: #222;
		}
		#sx-header{
			background: url('../i/user_by.png');
			background-repeat:no-repeat;
			background-position:top top;
			background-size:cover;
		}
		#sx-header .l {
			width: 3rem;
		}
		#sx-header .l img{
			position: absolute;
			top: 0.6rem;
			left: 0.6rem;
			width: 1rem;
			transform: rotate(180deg);
			-webkit-transform: rotate(180deg);
		}
		#sx-header{
			position: fixed;
			top: 0;
			left: 0;
			background-color:rgba(51, 51, 51, 1);
		}
		#sx-header .aui-title{
			/*opacity: 0;*/
		}
		.aui-content{
			margin-top:2.24rem;
		}
		.user_info{
			/*background: url('../i/user_by.png');
			background-repeat:no-repeat;
			background-position:bottom bottom;
			background-size:cover;*/
			padding: 1.2rem 0.75rem;
			border-bottom: 1px solid #f3f3f3;
			margin-bottom: 1rem;
		}
		.user_content{
			padding-top: 0.75rem;
		}
		.user{
			display: flex;
			justify-content: flex-start;
			align-items: center;
		}
		.user img{
			border-radius: 50%;
			width: 2.5rem;
			height: 2.5rem;
			border: 1px solid #f3f3f3;
		}
		.user .r{
			padding-left: 0.75rem;
		}
		.user .r .h5{
			font-size: 0.75rem;
			/*color: #fff;*/
		}
		.user .r .p{
			/*color: #fff;*/
			opacity: 0.5;
			font-size: 0.65rem;
			padding-top: 0.25rem;
		}
		.user .r .p b{
			padding: 0 0.15rem;
			font-weight: normal;

		}
		.list{
			margin: 0.25rem;
			/*height: 100rem;*/
		}
		.list .a{
			margin: 0.25rem;
			/*background: #fdf9f9;*/
		}
		.list .a img{
			background: #fdf9f9;
			width: 100%;
			height: 100%;
			border-radius: 0.35rem;
		}
		.list .text{
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 0.35rem;
		}
		.list .text{
			font-size: 0.65rem;
		}
		.list .text b{
			font-size: 0.85rem;
			color: #FE2C55;
			padding-right: 0.2rem;
		}
		.list .a .title{
			padding: 0.35rem;
			padding-bottom: 0;
		}
		.list .img{
			position: relative;
		}
		.list .img .t{
			background: rgba(0, 0, 0, 0.3);
			position: absolute;
			z-index: 1;
			width: 100%;
			height: 100%;
			top: 0;
			left: 0;
		}
		.list .img em{
			background: url('../i/pause_start.png') no-repeat center center;
			background-size:100%;
			display: block;
		  height: 2.5rem;
		  width: 2.5rem;
		  position: absolute;
		  z-index: 10;
		  left:0; right:0; top:0; bottom:0;
		  margin:auto;
		}
	</style>
	</head>
	<body>
		<header class="aui-bar aui-bar-nav" id="sx-header">
			<a class="aui-pull-left aui-btn l" tapmode onclick="_close()">
				<img src="../i/right-bai.png" />
			</a>
			<div class="aui-title"></div>
			<a class="aui-pull-right aui-btn r" tapmode onclick="_url({},'shop_win')">
				购物助手
			</a>
		</header>
		<div class="aui-content">
			<div class="user_info">
				<div class="user">
					<img src="../i/touxiang.png">
					<div class="r">
						<div class="h5"></div>
						<div class="p">全部商品<b>0</b>件</div>
					</div>
				</div>
				<div class="user_content"></div>
			</div>
			<div class="list">
				<script id="sx-list" type="text/x-dot-template">
					{{ for(var i=0,it=it.data; i < it.length; i++) { }}
					<div class="aui-col-xs-6" tapmode onclick="aurl({{= it[i].id}})">
						<div class="a">
							<div class="img">
								<img src="../i/loading_a.png" suxiangw-src="{{= _img(it[i].img,api.winWidth/2.5) }}" />
								{{? it[i].vid}}
								<div class="t"></div>
								<em></em>
								{{?}}
							</div>
							<div class="title aui-ellipsis-1">{{= it[i].title}}</div>
							<div class="text">
								<div><b>{{= it[i].money}}</b>元</div>
								<div>已售{{= it[i].num_s}}</div>
							</div>
						</div>
					</div>
					{{ } }}
				</script>
				<div class="aui-row" id="sx-view">
					<div id="jiazai"><img src="../i/loading_more.gif" /></div>
				</div>
			</div>
		</div>
	</body>
	<script type="text/javascript" src="../j/api.js"></script>
	<script type="text/javascript">
		apiready = function() {
			data();
			header = $api.byId('sx-header');
			$api.fixStatusBar(header);
			$api.fixStatusBar($api.dom('.aui-content'));
			if (!api.pageParam['uid']) {
				return _alert('店铺不存在或者已下架', function(ret, err) {
					_close();
				})
			}
			url = 'shop/lists/uid/' + api.pageParam['uid'];
			console.log(uid)
			_list({
				url: url,
				loading: 1
			});
			// 监听滚动
			api.addEventListener({
				name: 'scrolltobottom',
			}, function(ret, err) {
				if (heigutgao == 1) { // heigutgao=1开启执行 0停止执行   防止连续滚动，等加载数据之后在进行滚动。
					pagenum += 1
					_list({
						url: url,
						page: pagenum
					});
				}
			});
		}

		function data() {
			if (api.pageParam['zhibo']) {
				$('#sx-header .r').hide();
				$('.user_content').hide();
			}
			_ajax('shop`info', function(ret, err) {
				if (ret) {
					$('.user .r .h5').text(ret.title);
					$('.user .r .p b').text(ret.num);
					$('.user img').attr('src', _img(ret.img, 100));
					$('.user_content').text(ret.content);
					$('.aui-title').text(ret.title);
				}
			}, {
				uid: api.pageParam['uid']
			})
		}
		// 选择跳转
		function aurl(id) {
			if (api.pageParam['zhibo']) {
				_suxiangw_msg({
					content: '确定此商品推销给观众吗？',
					rightTitle: '确定推销',
					url: 'queren(' + id + ')'
				})
			} else {
				_url({
					id: id
				}, 'shop_view_win')
			}
		}
		// 更新商品ID
		function queren(id) {
			_loading();
			_ajax('zhibo/shop_id', function(ret, err) {
				_loadingCloes();
				if (ret) {
					console.log(JSON.stringify(ret))
					if (ret.ret) {
						api.execScript({
							name: 'zhibo_view_win',
							script: '_msg("' + ret.ret + '");'
						});
						_close();
					} else {
						_msg(ret.err)
					}
				} else {
					_alert(JSON.stringify(err))
				}
			}, {
				shop_id: id
			})
		}
	</script>
</html>
